<template>
	<view class="container">
		<view v-if="comment_list.length == 0" class="no-content">暂无评价</view>
		<view v-else>
			<view class="evaluate-header">
				<text>综合评分</text>
				<view style="margin-left: 20rpx;"><sx-rate disabled :value="starcount" :max="nostarcount" /></view>
			</view>
			<view class="evaluate-container" v-for="(item, index) in comment_list" :key="index">
				<evaluate-info :item="item"></evaluate-info>
				<view class="evaluate-line" v-show="resultLength - 1 > index"></view>
			</view>
		</view>
	</view>
</template>

<script>
import { getAppCommentScore } from '@/constant/customer.js';
import { getAppOnlineServePlayerCommentList } from '@/constant/onlineServe.js';
import { isLogin } from '@/config/common.js';
import { baseImageUrl } from '@/config/config.js';
import SxRate from '@/components/sx-rate';
import evaluateInfo from '@/packagePages/index/evaluate/components/evaluateInfo.vue';
export default {
	components: {
		SxRate,
		evaluateInfo
	},
	data() {
		return {
			baseImageUrl: baseImageUrl,
			servePlayerId: '',
			starcount: 0,
			nostarcount: 5,
			comment_list: [],
			resultLength: 0,
			query_filter: {
				servePlayerId: '',
				pageIndex: 0,
				pageSize: 10
			}
		};
	},
	onLoad: function(option) {
		if (isLogin()) {
			if (option.servePlayerId) {
				this.servePlayerId = option.servePlayerId;
				this.query_filter.servePlayerId = option.servePlayerId;
				if (this.servePlayerId) {
					this.getCommentScore();
					this.getCommentList(this.query_filter);
				}
			}
		} else {
			toLogin();
		}
	},
	onReachBottom() {
		this.query_filter.pageIndex++;
		this.getCommentList(this.query_filter);
	},
	onPullDownRefresh() {
		this.query_filter.pageIndex = 0;
		this.getCommentList(this.query_filter);
	},
	methods: {
		async getCommentScore() {
			//评论星级
			let res = await getAppCommentScore({
				servePlayerId: this.servePlayerId
			});
			this.starcount = parseInt(res);
		},
		async getCommentList() {
			//评论列表
			let res = await getAppOnlineServePlayerCommentList(this.query_filter);
			uni.stopPullDownRefresh();
			if (this.query_filter.pageIndex > 0) {
				for (let i = 0; i < res.Source.length; i++) {
					let obj = res.Source[i];
					this.comment_list.push(obj);
				}
			} else {
				this.comment_list = res.Source;
			}
			this.resultLength = this.comment_list.length;
		}
	}
};
</script>

<style scoped lang="scss">
.evaluate-line {
	width: 100%;
	height: 2rpx;
	background-color: $main-line-color;
	margin-bottom: 30rpx;
	margin-top: 30rpx;
}

.evaluate-container {
	min-height: 140rpx;
	padding-bottom: 20rpx;
	padding: 0 30rpx 0 30rpx;
}

.evaluate-header {
	display: flex;
	align-items: center;
	font-size: $main-text-size-32;
	padding: 20rpx 0 30rpx 30rpx;
	font-family: 'SourceHanSansCN-Medium';
}
.no-content {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100vh;
}
</style>
